import { Drawer, Divider, Avatar } from 'antd';
import React, { useState, useRef } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import type { ProColumns, ActionType } from '@ant-design/pro-table';
import ProTable from '@ant-design/pro-table';
import ProDescriptions from '@ant-design/pro-descriptions';
import moment from 'moment';
import { selectOutManUsingGET } from '@/services/test/Employ';

const Index: React.FC = () => {
  const [showDetail, setShowDetail] = useState<boolean>(false);
  const actionRef = useRef<ActionType>();
  const [currentRow, setCurrentRow] = useState<any>();

  const columns: ProColumns<any>[] = [
    {
      title: '姓名',
      key: 'name',
      render: (dom: any, entity) => {
        return (
          <a
            onClick={() => {
              setCurrentRow(entity);
              setShowDetail(true);
            }}
          >
            {dom.userId.name}
          </a>
        );
      },
    },
    {
      title: '曾投递岗位',
      key: 'postId',
      // valueType: 'textarea',
      render: (dom: any) => {
        return <p>{dom.postId.name}</p>;
      },
    },
    {
      title: '所学专业',
      key: 'userId',
      hideInSearch: true,
      render: (dom: any) => {
        return <p>{dom.userId.major}</p>;
      },
    },
    {
      title: '最高学历',
      hideInSearch: true,
      render: (dom: any) => {
        return <p>{dom.userId.education}</p>;
      },
    },
    {
      title: '最高学位',
      hideInSearch: true,
      render: (dom: any) => {
        return <p>{dom.userId.degree}</p>;
      },
    },
    {
      title: '毕业学校',
      hideInSearch: true,
      render: (dom: any) => {
        return <p>{dom.userId.school}</p>;
      },
    },
    // 审核状态：0已投递，1审核中，2审核通过，3淘汰，4面试中，5面试通过，6面试淘汰，7资格审查中，8资格审查淘汰，9入职
    {
      title: '状态',
      dataIndex: 'status',
      valueEnum: {
        0: {
          text: '已投递',
          status: 'Default',
        },
        1: {
          text: '审核中',
          status: 'Processing',
        },
        2: {
          text: '初审通过',
          status: 'Success',
        },
        3: {
          text: '淘汰',
          status: 'Error',
        },
        4: {
          text: '面试中',
          status: 'Processing',
        },
        5: {
          text: '面试通过',
          status: 'Success',
        },
        6: {
          text: '面试淘汰',
          status: 'Error',
        },
        7: {
          text: '资格审查中',
          status: 'Processing',
        },
        8: {
          text: '资格审查淘汰',
          status: 'Error',
        },
        9: {
          text: '入职',
          status: 'Success',
        },
      },
    },
  ];

  const desColumn: ProColumns<any>[] = [
    {
      title: '姓名',
      dataIndex: ['userId', 'name'],
    },
    {
      title: '照片',
      dataIndex: ['userId', 'photo'],
      render: (text) => {
        return <Avatar shape="circle" size={128} src={text} />;
      },
    },
    {
      title: '电话',
      dataIndex: ['userId', 'phone'],
      copyable: true,
    },
    {
      title: '邮箱',
      dataIndex: ['userId', 'email'],
      copyable: true,
    },
    {
      title: '性别',
      dataIndex: ['userId', 'sex'],
    },
    {
      title: '身份证号码',
      dataIndex: ['userId', 'identityNum'],
    },
    {
      title: '所学专业',
      dataIndex: ['userId', 'major'],
    },
    {
      title: '最高学历',
      dataIndex: ['userId', 'education'],
    },
    {
      title: '最高学位',
      dataIndex: ['userId', 'degree'],
    },
    {
      title: '毕业学校',
      dataIndex: ['userId', 'school'],
    },
    {
      title: '政治面貌',
      dataIndex: ['userId', 'politicsStatus'],
    },
    {
      title: '民族',
      dataIndex: ['userId', 'nation'],
    },
    {
      title: '婚姻状况',
      dataIndex: ['userId', 'maritalStatus'],
    },
    // 审核状态：0已投递，1审核中，2审核通过，3淘汰，4面试中，5面试通过，6面试淘汰，7资格审查中，8资格审查淘汰，9入职
    {
      title: '状态',
      dataIndex: 'status',
      valueEnum: {
        0: {
          text: '已投递',
          status: 'Default',
        },
        1: {
          text: '审核中',
          status: 'Processing',
        },
        2: {
          text: '审核通过',
          status: 'Success',
        },
        3: {
          text: '淘汰',
          status: 'Error',
        },
        4: {
          text: '面试中',
          status: 'Processing',
        },
        5: {
          text: '面试通过',
          status: 'Success',
        },
        6: {
          text: '面试淘汰',
          status: 'Error',
        },
        7: {
          text: '资格审查中',
          status: 'Processing',
        },
        8: {
          text: '资格审查淘汰',
          status: 'Error',
        },
        9: {
          text: '入职',
          status: 'Success',
        },
      },
    },
    {
      title: '简历附件',
      dataIndex: ['userId', 'attachment'],
      span: '2',
      render: (text: any) => {
        return <a>{text}</a>;
      },
    },
  ];

  // TODO 仅获取被淘汰的候选人
  const getList = async (params?: any) => {
    const res = await selectOutManUsingGET({ ...params });
    return res;
  };

  return (
    <PageContainer content={'人才库中均为已被淘汰的候选人'}>
      <ProTable<any, API.PageParams>
        actionRef={actionRef}
        rowKey="id"
        search={{
          labelWidth: 120,
        }}
        pagination={{
          pageSize: 10,
        }}
        // 获取列表
        request={getList}
        // 列表名称
        columns={columns}
      />

      {/* 点名称查看详情 */}
      <Drawer
        width={600}
        visible={showDetail}
        onClose={() => {
          setCurrentRow(undefined);
          setShowDetail(false);
        }}
        closable={false}
      >
        {currentRow?.userId && (
          <>
            <ProDescriptions
              column={2}
              title={'投递信息'}
              request={async () => ({
                data: currentRow || {},
              })}
              columns={desColumn}
            >
              <ProDescriptions.Item span={2}>
                <Divider />
              </ProDescriptions.Item>
              <ProDescriptions.Item label={'投递岗位'}>
                {currentRow?.postId.name} &nbsp;&nbsp;
              </ProDescriptions.Item>
              <ProDescriptions.Item label={'投递时间'}>
                {moment(currentRow?.utcCreate).format('YYYY-MM-DD HH:mm')}
              </ProDescriptions.Item>
              {currentRow?.firstPeople ? (
                <>
                  <ProDescriptions.Item label={'初审审核人'}>
                    {currentRow?.firstPeople.name}
                  </ProDescriptions.Item>
                  <ProDescriptions.Item label="初审审核时间" valueType="dateTime">
                    {moment(currentRow?.firstTime).format('YYYY-MM-DD HH:mm')}
                  </ProDescriptions.Item>
                </>
              ) : undefined}

              {currentRow?.secondPeople ? (
                <>
                  <ProDescriptions.Item label={'二轮面试安排人'}>
                    {currentRow?.secondPeople.name}
                  </ProDescriptions.Item>
                  <ProDescriptions.Item label="面试时间" valueType="dateTime">
                    {moment(currentRow?.secondTime).format('YYYY-MM-DD HH:mm')}
                  </ProDescriptions.Item>
                </>
              ) : undefined}

              {currentRow?.thirdPeople ? (
                <>
                  <ProDescriptions.Item label={'二轮面试官'}>
                    {currentRow?.thirdPeople.name}
                  </ProDescriptions.Item>

                  <ProDescriptions.Item label={'面试通过时间'}>
                    {moment(currentRow?.thirdTime).format('YYYY-MM-DD HH:mm')}
                  </ProDescriptions.Item>
                  {/* <ProDescriptions.Item label={'第三次面试评价'} span={2}>
                    {currentRow?.thirdEvaluate}
                  </ProDescriptions.Item> */}
                </>
              ) : undefined}

              {currentRow?.forthPeople ? (
                <>
                  <ProDescriptions.Item label={'资格审查官'}>
                    {currentRow?.forthPeople.name}
                  </ProDescriptions.Item>
                  <ProDescriptions.Item label="资格审核时间" valueType="dateTime">
                    {moment(currentRow?.forthTime).format('YYYY-MM-DD HH:mm')}
                  </ProDescriptions.Item>
                </>
              ) : undefined}
            </ProDescriptions>
          </>
        )}
      </Drawer>
    </PageContainer>
  );
};

export default Index;
